<!doctype html>

<html xmlns:th="http://www.thymeleaf.org">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>XRay - Responsive Bootstrap 4 Admin Dashboard Template</title>
    <!-- Favicon -->
    <link rel="shortcut icon" href="xray/images/favicon.ico"/>
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="xray/css/bootstrap.min.css">
    <!-- Typography CSS -->
    <link rel="stylesheet" href="xray/css/typography.css">
    <!-- Style CSS -->
    <link rel="stylesheet" href="xray/css/style.css">
    <!-- Responsive CSS -->
    <link rel="stylesheet" href="xray/css/responsive.css">
   <!--  baidu map api  -->
   <script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=2COzFaICuIyVj7V3VetKfmdRVnX8BhVr"></script>

    <style>
        #container {
            /*overflow: hidden;*/
            width: 100%;
            height: 100%;
            margin: 0;
            font-family: "微软雅黑";
        }
    </style>

    <style>
        .my-mouse-img {
            position: absolute;
            z-index: 999;
        }
    </style>
</head>
<body>
    <img class="my-mouse-img" src="imgs/mouse-logo.jpg" alt="" width="60px">
    <script>
        document.addEventListener('mousemove', function (e) {
            //鼠标只要移动,就会触发事件
            var x = e.pageX;
            var y = e.pageY;
            var pic = document.querySelector('img');
            pic.style.left = x-20+'px';
            pic.style.top = y-40+'px';
        })
    </script>


<!-- loader Start -->

      <div id="loading">
         <div id="loading-center">
         </div>
      </div>
<!-- loader END -->
<!-- Wrapper Start -->



<div class="wrapper">
    <!-- Sidebar  -->
    <div class="iq-sidebar">
        <div class="iq-sidebar-logo d-flex justify-content-between">
            <a href="/agencylist">
                <img src="xray/images/logo.png" class="img-fluid" alt="">
                <span>XRay</span>
            </a>
            <div class="iq-menu-bt-sidebar">
                <div class="iq-menu-bt align-self-center">
                    <div class="wrapper-menu">
                        <div class="main-circle"><i class="ri-more-fill"></i></div>
                        <div class="hover-circle"><i class="ri-more-2-fill"></i></div>
                    </div>
                </div>
            </div>
        </div>
        <div id="sidebar-scrollbar">
            <nav class="iq-sidebar-menu">
                <ul class="iq-menu">
                    <li class="iq-menu-title"><i class="ri-subtract-line"></i><span>机构管理</span></li>
                    <li>
                        <a href="/agencylist" class="iq-waves-effect"><i class="ri-hospital-fill"></i><span>机构列表</span></a>
                    </li>
                    <li>
                        <a href="/addagency" class="iq-waves-effect"><i class="ri-home-8-fill"></i><span>增加机构</span></a>
                    </li>
                    <li>
                        <a href="/updateagency" class="iq-waves-effect"><i class="ri-briefcase-4-fill"></i><span>修改机构</span></a>
                    </li>
                    <li>
                        <a href="/reportlist" class="iq-waves-effect"><i class="ri-briefcase-4-fill"></i><span>投诉处理</span></a>
                    </li>


                    <li class="iq-menu-title"><i class="ri-subtract-line"></i><span>用户管理</span></li>
                    <li>
                        <a href="/userlist" class="iq-waves-effect"><i class="ri-hospital-fill"></i><span>账号管理</span></a>
                    </li>
                    <li>
                        <a href="/commentlist" class="iq-waves-effect"><i class="ri-hospital-fill"></i><span>评论管理</span></a>
                    </li>

                </ul>
            </nav>
            <div class="p-3"></div>
        </div>
    </div>
    <!-- Page Content  -->
    <div id="content-page" class="content-page">
        <!-- TOP Nav Bar -->
        <div class="iq-top-navbar">
            <div class="iq-navbar-custom">
                <div class="iq-sidebar-logo">
                    <div class="top-logo">
                        <a href="index.html" class="logo">
                            <img src="xray/images/logo.png" class="img-fluid" alt="">
                            <span>XRay</span>
                        </a>
                    </div>
                </div>
                <nav class="navbar navbar-expand-lg navbar-light p-0">
                    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                        <i class="ri-menu-3-line"></i>
                    </button>
                    <div class="iq-menu-bt align-self-center">
                        <div class="wrapper-menu">
                            <div class="main-circle"><i class="ri-more-fill"></i></div>
                            <div class="hover-circle"><i class="ri-more-2-fill"></i></div>
                        </div>
                    </div>
                    <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <ul class="navbar-nav ml-auto navbar-list">
                            <li class="nav-item">
                                <a class="search-toggle iq-waves-effect language-title" href="#"><img src="xray/images/small/flag-01.png" alt="img-flaf" class="img-fluid mr-1" style="height: 16px; width: 16px;" /> English <i class="ri-arrow-down-s-line"></i></a>
                                <div class="iq-sub-dropdown">
                                    <a class="iq-sub-card" href="#"><img src="xray/images/small/flag-02.png" alt="img-flaf" class="img-fluid mr-2" />French</a>
                                    <a class="iq-sub-card" href="#"><img src="xray/images/small/flag-03.png" alt="img-flaf" class="img-fluid mr-2" />Spanish</a>
                                    <a class="iq-sub-card" href="#"><img src="xray/images/small/flag-04.png" alt="img-flaf" class="img-fluid mr-2" />Italian</a>
                                    <a class="iq-sub-card" href="#"><img src="xray/images/small/flag-05.png" alt="img-flaf" class="img-fluid mr-2" />German</a>
                                    <a class="iq-sub-card" href="#"><img src="xray/images/small/flag-06.png" alt="img-flaf" class="img-fluid mr-2" />Japanese</a>
                                </div>
                            </li>
                            <li class="nav-item iq-full-screen">
                                <a href="#" class="iq-waves-effect" id="btnFullscreen"><i class="ri-fullscreen-line"></i></a>
                            </li>
                            <li class="nav-item">
                                <a href="#" class="search-toggle iq-waves-effect">
                                    <i class="ri-notification-3-fill"></i>
                                    <span class="bg-danger dots"></span>
                                </a>
                                <div class="iq-sub-dropdown">
                                    <div class="iq-card shadow-none m-0">
                                        <div class="iq-card-body p-0 ">
                                            <div class="bg-primary p-3">
                                                <h5 class="mb-0 text-white">All Notifications<small class="badge  badge-light float-right pt-1">4</small></h5>
                                            </div>
                                            <a href="#" class="iq-sub-card" >
                                                <div class="media align-items-center">
                                                    <div class="">
                                                        <img class="avatar-40 rounded" src="xray/images/user/01.jpg" alt="">
                                                    </div>
                                                    <div class="media-body ml-3">
                                                        <h6 class="mb-0 ">Emma Watson Bini</h6>
                                                        <small class="float-right font-size-12">Just Now</small>
                                                        <p class="mb-0">95 MB</p>
                                                    </div>
                                                </div>
                                            </a>
                                            <a href="#" class="iq-sub-card" >
                                                <div class="media align-items-center">
                                                    <div class="">
                                                        <img class="avatar-40 rounded" src="xray/images/user/02.jpg" alt="">
                                                    </div>
                                                    <div class="media-body ml-3">
                                                        <h6 class="mb-0 ">New customer is join</h6>
                                                        <small class="float-right font-size-12">5 days ago</small>
                                                        <p class="mb-0">Jond Bini</p>
                                                    </div>
                                                </div>
                                            </a>
                                            <a href="#" class="iq-sub-card" >
                                                <div class="media align-items-center">
                                                    <div class="">
                                                        <img class="avatar-40 rounded" src="xray/images/user/03.jpg" alt="">
                                                    </div>
                                                    <div class="media-body ml-3">
                                                        <h6 class="mb-0 ">Two customer is left</h6>
                                                        <small class="float-right font-size-12">2 days ago</small>
                                                        <p class="mb-0">Jond Bini</p>
                                                    </div>
                                                </div>
                                            </a>
                                            <a href="#" class="iq-sub-card" >
                                                <div class="media align-items-center">
                                                    <div class="">
                                                        <img class="avatar-40 rounded" src="xray/images/user/04.jpg" alt="">
                                                    </div>
                                                    <div class="media-body ml-3">
                                                        <h6 class="mb-0 ">New Mail from Fenny</h6>
                                                        <small class="float-right font-size-12">3 days ago</small>
                                                        <p class="mb-0">Jond Bini</p>
                                                    </div>
                                                </div>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </li>
                            <li class="nav-item dropdown">
                                <a href="#" class="search-toggle iq-waves-effect">
                                    <i class="ri-mail-open-fill"></i>
                                    <span class="bg-primary count-mail"></span>
                                </a>
                                <div class="iq-sub-dropdown">
                                    <div class="iq-card shadow-none m-0">
                                        <div class="iq-card-body p-0 ">
                                            <div class="bg-primary p-3">
                                                <h5 class="mb-0 text-white">All Messages<small class="badge  badge-light float-right pt-1">5</small></h5>
                                            </div>
                                            <a href="#" class="iq-sub-card" >
                                                <div class="media align-items-center">
                                                    <div class="">
                                                        <img class="avatar-40 rounded" src="xray/images/user/01.jpg" alt="">
                                                    </div>
                                                    <div class="media-body ml-3">
                                                        <h6 class="mb-0 ">Bini Emma Watson</h6>
                                                        <small class="float-left font-size-12">13 Jun</small>
                                                    </div>
                                                </div>
                                            </a>
                                            <a href="#" class="iq-sub-card" >
                                                <div class="media align-items-center">
                                                    <div class="">
                                                        <img class="avatar-40 rounded" src="xray/images/user/02.jpg" alt="">
                                                    </div>
                                                    <div class="media-body ml-3">
                                                        <h6 class="mb-0 ">Lorem Ipsum Watson</h6>
                                                        <small class="float-left font-size-12">20 Apr</small>
                                                    </div>
                                                </div>
                                            </a>
                                            <a href="#" class="iq-sub-card" >
                                                <div class="media align-items-center">
                                                    <div class="">
                                                        <img class="avatar-40 rounded" src="xray/images/user/03.jpg" alt="">
                                                    </div>
                                                    <div class="media-body ml-3">
                                                        <h6 class="mb-0 ">Why do we use it?</h6>
                                                        <small class="float-left font-size-12">30 Jun</small>
                                                    </div>
                                                </div>
                                            </a>
                                            <a href="#" class="iq-sub-card" >
                                                <div class="media align-items-center">
                                                    <div class="">
                                                        <img class="avatar-40 rounded" src="xray/images/user/04.jpg" alt="">
                                                    </div>
                                                    <div class="media-body ml-3">
                                                        <h6 class="mb-0 ">Variations Passages</h6>
                                                        <small class="float-left font-size-12">12 Sep</small>
                                                    </div>
                                                </div>
                                            </a>
                                            <a href="#" class="iq-sub-card" >
                                                <div class="media align-items-center">
                                                    <div class="">
                                                        <img class="avatar-40 rounded" src="xray/images/user/05.jpg" alt="">
                                                    </div>
                                                    <div class="media-body ml-3">
                                                        <h6 class="mb-0 ">Lorem Ipsum generators</h6>
                                                        <small class="float-left font-size-12">5 Dec</small>
                                                    </div>
                                                </div>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <ul class="navbar-list">
                        <li>
                            <a href="#" class="search-toggle iq-waves-effect d-flex align-items-center">
                                <img src="xray/images/user/1.jpg" class="img-fluid rounded mr-3" alt="user">
                                <div class="caption">
                                    <h6 class="mb-0 line-height" th:text="${myname}"></h6>
                                </div>
                            </a>
                            <div class="iq-sub-dropdown iq-user-dropdown">
                                <div class="iq-card shadow-none m-0">
                                    <div class="iq-card-body p-0 ">
                                        <div class="d-inline-block w-100 text-center p-3">
                                            <a class="bg-primary iq-sign-btn" href="sign-in.html" role="button">Sign out<i class="ri-login-box-line ml-2"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
        <!-- TOP Nav Bar END -->

        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <div class="iq-card">
                        <div class="iq-card-header d-flex justify-content-between">
                            <div class="iq-header-title">
                                <h4 class="card-title">新机构信息表</h4>
                            </div>
                        </div>
                        <div class="iq-card-body">
                            <div class="new-user-info">
                                <form th:action="@{/submitagency}" method="post" enctype="multipart/form-data">
                                    <div class="row">
                                        <div class="form-group col-md-6">
                                            <label for="agencyName">机构名称：</label>
                                            <input type="text" class="form-control" name="agencyName" id="agencyname"
                                                   placeholder="填入机构名称" required="required">
                                        </div>
                                        <div class="form-group col-md-6">
                                            <label for="agencyPhone">联系电话：</label>
                                            <input type="text" class="form-control" name="agencyPhone" id="agencyphone"
                                                   placeholder="填入联系电话" required="required" maxlength="11">
                                        </div>
                                        <div class="form-group col-md-6">
                                            <label for="agencyAddress">机构地址</label>
                                            <input type="text" class="form-control" name="agencyAddress"
                                                   id="agencyaddress" placeholder="填入机构地址">
                                        </div>
                                        <div class="form-group col-md-6">
                                            <label for="agencyIncome">是否营利</label>
                                            <select class="form-control" name="agencyIncome" id="agencyIncome">
                                                <option>是</option>
                                                <option>否</option>
                                            </select>
                                        </div>
                                        <div class="form-group col-md-12">
                                            <label for="agencyType">机构类型</label>
                                            <select class="form-control" name="agencyType" id="agencyType">
                                                <option>幼儿园</option>
                                                <option>中小学</option>
                                                <option>大学</option>
                                                <option>校外培训机构</option>
                                            </select>
                                        </div>

                                        <div class="form-group col-sm-12">
                                            <label for="agencyTime">机构创建时间</label>
                                            <input type="date" class="form-control" name="agencyTime" id="agencyTime" required="required">

                                        </div>


                                       <!--  上传图片-->
                                        <div class="form-group col-md-12">

                                           <label for="agencyTime">上传机构图片-图片大小不大于2MB</label>
                                           <div class="custom-file">

                                            <input type="file" name="agencyImg" class="custom-file-input" id="customFile"
                                                   onchange="fileChange(this);">

                                            <label class="custom-file-label" for="customFile">Choose File</label>
                                           </div>
                                        </div>

                                       <!--    地图插件-->
<!--                                       <div-->
<!--                                               class="form-group col-md-6">-->
<!--                                          <iframe name="my-map" id="my-map" src="getPositionMap"></iframe></div>-->
                                        <div class="form-group col-md-6" style="height:300px">
                                            <div id="container" style="overflow: auto; position: relative;"></div></div>

                                       <!--   获取地理位置-->
                                       <div class="form-group col-md-6">
                                          <label for="agencyX">X:</label>
                                          <input type="text" class="form-control" name="agencyX" id="agencyX"
                                                 placeholder="填入经度" required="required">
                                          <label for="agencyY">Y：</label>
                                          <input type="text" class="form-control" name="agencyY" id="agencyY"
                                                 placeholder="填入纬度" required="required">
                                       </div>


                                    </div>

                                    <button type="submit" class="btn btn-primary">确认添加新机构</button>
                                </form>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Footer -->
        <footer class="bg-white iq-footer">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-6">
                        <ul class="list-inline mb-0">
                            <li class="list-inline-item"><a href="privacy-policy.html">Privacy Policy</a></li>
                            <li class="list-inline-item"><a href="terms-of-service.html">Terms of Use</a></li>
                        </ul>
                    </div>
                    <div class="col-lg-6 text-right">
                        Copyright 2020 All Rights Reserved.
                    </div>
                </div>
            </div>
        </footer>
        <!-- Footer END -->
    </div>
</div>

<!--限制文件上传大小-->
    <script type="text/javascript">
        var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
        function fileChange(target,id) {
            var fileSize = 0;
            var filetypes =[".jpg",".png",".rar",".txt",".zip",".doc",".ppt",".xls",".pdf",".docx",".xlsx"];
            var filepath = target.value;
            var filemaxsize = 1024*1.8;//1.8M
            if(filepath){
                var isnext = false;
                var fileend = filepath.substring(filepath.lastIndexOf("."));
                if(filetypes && filetypes.length>0){
                    for(var i =0; i<filetypes.length;i++){
                        if(filetypes[i]==fileend){
                            isnext = true;
                            break;
                        }
                    }
                }
                if(!isnext){
                    alert("不接受此文件类型！");
                    target.value ="";
                    return false;
                }
            }else{
                return false;
            }
            if (isIE && !target.files) {
                var filePath = target.value;
                var fileSystem = new ActiveXObject("Scripting.FileSystemObject");
                if(!fileSystem.FileExists(filePath)){
                    alert("附件不存在，请重新输入！");
                    return false;
                }
                var file = fileSystem.GetFile (filePath);
                fileSize = file.Size;
            } else {
                fileSize = target.files[0].size;
            }

            var size = fileSize / 1024;
            if(size>filemaxsize){
                alert("附件大小不能大于"+filemaxsize/1024+"M！");
                target.value ="";
                return false;
            }
            if(size<=0){
                alert("附件大小不能为0M！");
                target.value ="";
                return false;
            }
        }

    </script>


<!--地图插件-->
<script>


    var map = new BMapGL.Map('container');
    // 创建地图实例

    // 创建点坐标
    var centerpoint = new BMapGL.Point(116.404, 39.915);

    // 初始化地图，设置中心点坐标和地图级别
    map.centerAndZoom(centerpoint, 15);

    //开启滚轮缩放地图
    map.enableScrollWheelZoom(true);

    //版权控件remove有问题
    var scaleCtrl = new BMapGL.ScaleControl();  // 添加比例尺控件
    map.addControl(scaleCtrl);
    var zoomCtrl = new BMapGL.ZoomControl();  // 添加缩放控件
    map.addControl(zoomCtrl);

    map.addEventListener('click', function (e) {
        alert('点击位置经纬度：' + e.latlng.lng + ',' + e.latlng.lat);
        document.getElementById('agencyX').value=e.latlng.lng;
        document.getElementById('agencyY').value=e.latlng.lat;
    });
</script>

<!-- Wrapper END -->
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="xray/js/jquery.min.js"></script>
<script src="xray/js/popper.min.js"></script>
<script src="xray/js/bootstrap.min.js"></script>
<!-- Appear JavaScript -->
<script src="xray/js/jquery.appear.js"></script>
<!-- Countdown JavaScript -->
<script src="xray/js/countdown.min.js"></script>
<!-- Counterup JavaScript -->
<script src="xray/js/waypoints.min.js"></script>
<script src="xray/js/jquery.counterup.min.js"></script>
<!-- Wow JavaScript -->
<script src="xray/js/wow.min.js"></script>
<!-- Apexcharts JavaScript -->
<script src="xray/js/apexcharts.js"></script>
<!-- Slick JavaScript -->
<script src="xray/js/slick.min.js"></script>
<!-- Select2 JavaScript -->
<script src="xray/js/select2.min.js"></script>
<!-- Owl Carousel JavaScript -->
<script src="xray/js/owl.carousel.min.js"></script>
<!-- Magnific Popup JavaScript -->
<script src="xray/js/jquery.magnific-popup.min.js"></script>
<!-- Smooth Scrollbar JavaScript -->
<script src="xray/js/smooth-scrollbar.js"></script>
<!-- lottie JavaScript -->
<script src="xray/js/lottie.js"></script>
<!-- Chart Custom JavaScript -->
<script src="xray/js/chart-custom.js"></script>
<!-- Custom JavaScript -->
<script src="xray/js/custom.js"></script>
</body>
</html>